<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE-edga" />
    <title>Page1</title>
    <link rel="stylesheet" href="css/public.css" />
    <link rel="stylesheet" href="css/header.css" />
    <link rel="stylesheet" href="css/common.css" />
    <link rel="stylesheet" href="css/product-manage.css" />
    <script src="js/jquery.min.js"></script>
</head>

<body>
    <div class="page1_header">
        <div class="page1_header_main">
            <section>
                <a class="section_logo"><img src="img/logo.png" alt=""></a>
                <a>总览</a>
                <a class="section_arrow">云产品</a>
            </section>
            <section>
                <a class="section__search"><input type="text" placeholder="搜索你想要的内容…" /><img src="img/形状.png" alt="" /></a>
                <a class="section__wx"><img src="img/编组 19.png" alt=""><span>小程序</span></a>
                <a class="section_email"><img src="img/形状(1).png" alt=""><span>14</span></a>
                <a class="section_arrow">集团账号</a>
                <a class="section_arrow">工具</a>
                <a class="section_arrow">支持</a>
                <a class="section_arrow">费用</a>
                <a class="section_arrow section_user"><img src="img/椭圆形.png" alt=""></a>
            </section>
        </div>
    </div>

    <div class="page1_container">
        <div class="container__group">
            <a class="group__item  active" href="./a.html"><span>产品管理</span></a>
            <a class="group__item" href="./b.html"><span>产品监控</span></a>
            <a class="group__item" href="./c.html"><span>产品运维</span></a>
        </div>
        <div class="container__main">
            <section>
                <div class="page1_card product-resources">
                    <header><span>产品资源</span><a>更多产品</a></header>
                    <main>
                        <div class="main__item">
                            <img src="img/矩形(1).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">人脸识别</div>
                                <div class="info__sub-name text-overflow">精准稳定的人脸识别服务</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(2).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">人脸核身</div>
                                <div class="info__sub-name text-overflow">秒级确认身份真实性</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(3).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">域名注册</div>
                                <div class="info__sub-name text-overflow">专业安全的域名服务</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(4).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">证书监控 SSLPod</div>
                                <div class="info__sub-name text-overflow">安全评级管理</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(5).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">物联网设备</div>
                                <div class="info__sub-name text-overflow">安全可靠的物联网设备</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(6).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">团队协同</div>
                                <div class="info__sub-name text-overflow">高效的团队协同平台</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(7).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">金融专有云</div>
                                <div class="info__sub-name text-overflow">金融公有云环境版本</div>
                            </div>
                        </div>
                        <div class="main__item">
                            <img src="img/矩形(8).png" alt="" />
                            <div class="item__info">
                                <div class="info__name text-overflow">数字峰会平台</div>
                                <div class="info__sub-name text-overflow">周期云峰会解决方案</div>
                            </div>
                        </div>
                    </main>
                </div>
                <div class="page1_card product-expenses">
                    <header><span>费用信息</span></header>
                    <main>
                        <section>
                            <div class="section__item">
                                <div class="item__info">
                                    <div class="info__text">账户余额</div>
                                    <div class="info__price"><span>40.00</span><span>元</span></div>
                                    <button class="active"><span>充值</span></button>
                                </div>
                            </div>
                            <div class="section__item">
                                <div class="item__info">
                                    <div class="info__text">优惠钱</div>
                                    <div class="info__price"><span>10.00</span><span>元</span></div>
                                    <button><span>去使用</span></button>
                                </div>
                            </div>
                            <div class="section__item">
                                <div class="item__info">
                                    <div class="info__text">可开发票</div>
                                    <div class="info__price"><span>196.00</span><span>元</span></div>
                                    <button><span>开票</span></button>
                                </div>
                            </div>
                        </section>

                        <section>
                            <div class="section__title">历史订单</div>

                            <div class="section__table">
                                <table>
                                    <thead>
                                        <td>订单号</td>
                                        <td>产品名称</td>
                                        <td>金额</td>
                                        <td>交易时间</td>
                                        <td>交易状态</td>
                                        <td>支付方式</td>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td>CHN12934857757</td>
                                            <td>开通会员</td>
                                            <td>¥ 169</td>
                                            <td>2021/2/21 12:25</td>
                                            <td>未支付</td>
                                            <td>
                                                <button><span>去支付</span></button>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>CHN12934857757</td>
                                            <td>开通会员</td>
                                            <td>¥ 169</td>
                                            <td>2021/2/21 12:25</td>
                                            <td class="status--success">已支付</td>
                                            <td>微信</td>
                                        </tr>
                                        <tr>
                                            <td>CHN12934857757</td>
                                            <td>开通会员</td>
                                            <td>¥ 169</td>
                                            <td>2021/2/21 12:25</td>
                                            <td class="status--success">已支付</td>
                                            <td>微信</td>
                                        </tr>
                                        <tr>
                                            <td>CHN12934857757</td>
                                            <td>开通会员</td>
                                            <td>¥ 169</td>
                                            <td>2021/2/21 12:25</td>
                                            <td class="status--success">已支付</td>
                                            <td>微信</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

                            <div class="section__pagination">
                                <span>共 20 条</span>
                                <div class="pagination__select"><span>10</span><img src="img/icon_arrow.png" alt="" /></div>
                                <span class="pagination__size">条/页</span>
                                <button><img src="img/Page 1(1).png" alt="" /></button>
                                <button class="active"><span>1</span></button>
                                <button><span>2</span></button>
                                <button><span>3</span></button>
                                <button><span>...</span></button>
                                <button><span>20</span></button>
                                <button><img src="img/Page 1.png" alt="" /></button>
                                <span class="pagination__goto">前往</span>
                                <input type="text" value="1" />
                                <span class="pagination__page">页</span>
                            </div>
                        </section>
                    </main>
                </div>
                <div class="page1_card product-help">
                    <header><span>帮助文档</span></header>
                    <main>
                        <section>
                            <div class="section__title">
                                <span class="text-overflow">使用 SSH 密钥登录还可以同时使用密码密钥登录还可以同时使用密码</span>
                                <img src="img/标签.png" alt="" />
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">提交时提示“证件上的名称与域名所有者不一致” 如何处理？</span>
                                <img src="img/标签.png" alt="" />
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">域名实名认证和备案及账号实名认证有什么区别？</span>
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">域名实名认证审核中是否可以修改信息呢？</span>
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">实名认证失败的原因是什么？</span>
                                <img src="img/标签(1).png" alt="" />
                            </div>
                        </section>
                        <section>
                            <div class="section__title">
                                <span class="text-overflow">域名什么情况下需要进行备案呢？ </span>
                                <img src="img/标签(1).png" alt="" />
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">是否需要备案的判断条件是域名还是 80 端口？</span>
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">在微信无法播放视频，非微信情况下却可以播放的问题？</span>
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">能否对视频做配音、亮度调节、画中画等编辑？</span>
                                <img src="img/标签(1).png" alt="" />
                            </div>
                            <div class="section__title">
                                <span class="text-overflow">浏览器环境不支持播放时会有什么提示？</span>
                            </div>
                        </section>
                    </main>

                    <header><span>历史预览</span></header>

                    <main>
                        <section>
                            <div class="section__space">
                                <div class="section__title">
                                    <img src="img/说明1.png" alt="" />
                                    <span class="text-overflow">如何获取云服务器的初始密码？如何获取云服务器的初始密码？</span>
                                </div>
                                <img src="img/路径.png" alt="" />
                            </div>
                        </section>
                        <section>
                            <div class="section__space">
                                <div class="section__title">
                                    <img src="img/说明1.png" alt="" />
                                    <span class="text-overflow">域名的价格是多少？</span>
                                </div>
                                <img src="img/路径.png" alt="" />
                            </div>
                        </section>
                        <section>
                            <div class="section__space">
                                <div class="section__title">
                                    <img src="img/说明1.png" alt="" />
                                    <span class="text-overflow">域名购买多年是否有优惠？</span>
                                </div>
                                <img src="img/路径.png" alt="" />
                            </div>
                        </section>

                    </main>
                </div>
            </section>
            <section>
                <div class="page1_card product-user">
                    <header><span></span><img src="img/路径 2.png" alt="" /></header>

                    <main>
                        <img src="img/编组 8.png" alt="" />

                        <div class="main__content">
                            <div class="content__code">CHN13384984900</div>
                            <div class="content__text">
                                <span>实名认证</span>
                                <span>已实名</span>
                            </div>
                        </div>

                        <div class="main__footer">
                            <section>
                                <div class="section__name">用户数量</div>
                                <div class="section__value">
                                    <span>40</span>
                                    <span>人</span>
                                </div>
                            </section>
                            <section>
                                <div class="section__name">用户组数</div>
                                <div class="section__value">
                                    <span>18</span>
                                    <span>组</span>
                                </div>
                            </section>
                            <section>
                                <div class="section__name">角色数量</div>
                                <div class="section__value">
                                    <span>27</span>
                                    <span>个</span>
                                </div>
                            </section>
                        </div>
                    </main>
                </div>

                <div class="page1_card product-services">
                    <div class="services__content">
                        <img src="img/形状(2).png" alt="" />
                        <span>为保障您的权益，请勿线下交易！90%的欺诈、纠纷、资金盗窃均由线下交易导致。</span>
                    </div>

                    <button>
                        <img src="img/编组 29.png" alt="" />
                        <span>一键联系客服</span>
                    </button>
                </div>
                <div class="page1_card product-news">
                    <header><span>最新发布</span></header>
                    <main>
                        <section>
                            <img src="img/位图.png" alt="" />
                            <div class="section__info">
                                <div class="info__title">服务网络，一致、可靠、透明的云原生应用通信网络管控基础平台</div>
                                <div class="info__footer">
                                    <div class="footer__tag"><span>科技资讯</span></div>
                                    <span>2020-12-28</span>
                                </div>
                            </div>
                        </section>
                        <section>
                            <img src="img/位图(1).png" alt="" />
                            <div class="section__info">
                                <div class="info__title">服务网络，一致、可靠、透明的云原生应用通信网络管控基础平台</div>
                                <div class="info__footer">
                                    <div class="footer__tag"><span>科技资讯</span></div>
                                    <span>2020-12-28</span>
                                </div>
                            </div>
                        </section>
                        <section>
                            <img src="img/位图(2).png" alt="" />
                            <div class="section__info">
                                <div class="info__title">服务网络，一致、可靠、透明的云原生应用通信网络管控基础平台</div>
                                <div class="info__footer">
                                    <div class="footer__tag"><span>科技资讯</span></div>
                                    <span>2020-12-28</span>
                                </div>
                            </div>
                        </section>
                    </main>
                    <footer>
                        <button><img src="img/Page 1(1).png" alt="" /></button>
                        <button><img src="img/Page 1.png" alt="" /></button>
                    </footer>
                </div>
        </div>

        </section>
    </div>

    </div>
</body>

</html>